HTML <img> Tag
HTML <img> tag is used to add image or to set the background in the webpage/website. Nowadays website does not directly add images to a web page, as the images are linked to web pages by using the <img> tag which holds space for the image.
Syntax :
<img src="url" alt="some_text">
Attributes:
|
Attribute value |
Description |
|---|---|
|
src |
It is used to specifies the URL path of the source image. |
|
alt |
It is used to specifies an alternate text for the image if the image for some reason cannot be displayed. |
Example: In this example, we are using the <img> tag along with src, width, height, and alt attributes.
HTML
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style> img { border: 2px solid black; padding: 5px; } </style> </head> <body> <img src= "https://media.w3wiki.org/wp-content/uploads/20210827151326/gfg-200x200.png" alt="image" width="200px" height="200px" /> <p>Geeks For Geeks</p> </body> </html> |
Output: In the case of the <img> tag, it is not properly aligned and is very close to the margin, and the caption is away from the image. The image and caption are not part of each other. The border is not the part of both image and caption. <img> tag is an inline element but when we specify width and height it becomes a block element.
tag
Difference between & tags in HTML
In this article, we will learn about the <figure> & <img> tag along with its implementation. We will also learn the differences between them. Let’s begin the discussion with the figure tag in HTML.
Table of Content
- HTML <figure> Tag:
- HTML <img> Tag:
- Difference between <figure> and <img> tags:
Contact Us